<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
      <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    <%  
	String path = request.getContextPath();  
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";  
%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="/bsc/static/common/bootstrap/js/bootstrap-3.3.7-dist/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="/bsc/static/common/bootstrap/js/bootstrap-3.3.7-dist/css/bootstrap-theme.min.css">
<script src="/bsc/static/js/jquery-3.1.1.js"></script>
<script src="/bsc/static/common/bootstrap/js/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>

</head>
<body>
<form action="<%=basePath%>qtbagselect" method="post">
	<table data-toggle="table" class="table table-hover table-condensed" >
		<tr>
			<td>礼包编号：</td>
			<td>
				<input type="text" class="form-control" id="m" name="bag_id" value="${bag_id }" placeholder="请输入礼包编号" />
			</td>
			<td>礼包名称：</td>
			<td>
				<input type="text" class="form-control" id="u" name="bag_name" value="${bag_name }" placeholder="请输入礼包名称" />
			</td>
			<td>价格区间：</td>
			<td>
				<input type="text" class="form-control" id="zhi1" name="rmb_price1" placeholder="请选择最低价格" value="${rmb_price1 }"/>
			</td>
			<td>
				<input type="button" id="jian1" value="-"/>
				<input type="button" id="jia1" value="+"/>
			</td>
			
			<td>至</td>
			<td>
				<input type="text" id="zhi2" name="rmb_price2" value="${rmb_price2 }"  placeholder="请选择最高价格" class="form-control" />
			</td>
			<td>
				<input type="button" id="jian2" value="-"/>
				<input type="button" id="jia2" value="+"/>
			</td>
			<td>
				<input type="submit"  value="查询" />
			</td>
			<td>
				<input type="reset"   value="重置" />
			</td>
		</tr>
	</table>
</form>
		<table data-toggle="table" class="table table-hover table-condensed" >
				<tr>
					<td>礼包宣传图片</td>
					<td>礼包编号</td>
					<td>礼包名称</td>
					<!-- <td>创建时间</td> -->
					<td>礼包价格（元）</td>
					<td>礼包内容</td>
					<td>上架时间</td>
					<td>有效期（天）</td>
					<td>状态</td>
					<td>操作</td>
				</tr>
				<c:forEach items="${qtlist }" var="a">
					<tr>
						<td>
							<div style="width:100px; height:100px; border-radius:50%; overflow:hidden;">
								<img width="100px" height="100px" src="/bsc${a.cover_photo}"/>
							</div>
						</td>
						<td>${a.bag_id }</td>
						<td>${a.bag_name }</td>
						<%-- //<td>${a.create_time }</td> --%>
						<td>${a.bag_total_price }</td>
						<td>${a.content }</td>
						<td>${a.putaway_time }</td>
						<td>${a.valid_day}</td>
						<td>
						<c:if test="${a.status==1}">在售</c:if>
						<c:if test="${a.status==2}">已下架</c:if>
						</td>
				 		<td align="center">
							<button type="button"  onclick = "bagupdByid(${a.bag_id } )">查看详情</button>
						</td>
					</tr>
				</c:forEach>
			</table>
			
			<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      </div>
      <div class="modal-body">
        <table border="0" cellspacing="0" cellpadding="10" width="80%"
			class="table ">
        	<tr>
        		<td>礼包宣传图片</td>
        		<td><div style="width:100px; height:100px; border-radius:50%; overflow:hidden;">
        		<img width="100px" height="100px"  src="" id="cover_photo"/>
        		</div></td>
        		<td>封面图片</td>
        		<td><div style="width:100px; height:100px; border-radius:50%; overflow:hidden;">
        		<img width="100px" height="100px"  src="" id="cover_big_photo"/>
        		</div></td>
        	</tr>
        	<tr>
        		<td>礼包名称</td>
        		<td>
        			<input type="text" id="show_bag_name" name="bag_name"/>
        		</td>
        	</tr>
        	<tr>
        		<td>上架时间</td>
        		<td>
        			<input type="text" id="putaway_time" name="putaway_time"/>
        		</td>
        	</tr>
        	<tr>
        		<td>卡剩余量</td>
        		<td>
        			<input type="text" id="remain_num" name="remain_num"/>
        			
        		</td>
        	</tr>
        	<tr>
        		<td>创建时间</td>
        		<td>
        		 <input type="text" id="create_time" name="create_time"/>
        		</td>
        	</tr>
        	<tr>
        		<td>购买说明</td>
        		<td>
        			<textarea class="form-control" rows="5" cols="5" name="content" id="content">
        			
        			</textarea>
        		</td>
        	</tr>
        	
        </table>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
      </div>
    </div>
  </div>
</div>
</body>
</html>
<script type="text/javascript">
function bagupdByid(id){
	console.log(id);
	//模态
	$.ajax({
		type:"post",
		url:"<%=basePath%>bagupdByid",
		data:{'bag_id':id},
		dataType:"json",
		success:function(msg){
			$("#show_bag_name").val(msg.bag_name);
			$("#cover_photo").prop("src","/bsc"+msg.cover_photo);
			$("#cover_big_photo").prop("src","/bsc"+msg.cover_big_photo);
			$("#putaway_time").val(msg.putaway_time);
			$("#remain_num").val(msg.remain_num);
			$("#create_time").val(msg.create_time);
			$("#content").val(msg.content);
		}
	})
	$("#myModal").modal("show");
	
}

var zhi1 = null;
//$("#zhi1").val(zhi1);
$("#jian1").on("click",function(){
	if(zhi1>10){
		zhi1 = zhi1 - 10;
	}
	$("#zhi1").val(zhi1);
});

$("#jia1").on("click",function(){
	
		zhi1 = zhi1 + 10;
	
	$("#zhi1").val(zhi1);
});

var zhi2 = null;
//$("#zhi2").val(zhi2);
$("#jian2").on("click",function(){
	if(zhi2>10){
		zhi2 = zhi2 - 10;
	}
	$("#zhi2").val(zhi2);
});

$("#jia2").on("click",function(){
	
		zhi2 = zhi2 + 10;
	
	$("#zhi2").val(zhi2);
});
</script>